<cfparam name="resetFilters" default="false">
<cfset isFiltered = false />
<cfset queryParams = StructNew() />

<!--- <cfif NOT IsDefined("client.volunteers.approved") or resetFilters>
	<cfset client.volunteers.approved = "All">
<cfelseif IsDefined("filterApproved")>
	<cfset client.volunteers.approved = filterApproved>
</cfif>
<cfif client.volunteers.approved neq "All">
	<cfset isFiltered = true />
	<cfset queryParams.Approved = client.volunteers.approved />
</cfif>

<cfif NOT IsDefined("client.volunteers.archived") or resetFilters>
	<cfset client.volunteers.archived = "No">
<cfelseif IsDefined("filterArchived")>
	<cfset client.volunteers.archived = filterArchived>
</cfif>
<cfif client.volunteers.archived eq "All">
	<cfset isFiltered = true />
	<cfset queryParams.Archived = "" />
<cfelseif client.volunteers.archived eq "Yes">
	<cfset isFiltered = true />
	<cfset queryParams.Archived = "Yes" />
<cfelseif client.volunteers.archived eq "No">
	<cfset queryParams.Archived = "No" />
</cfif>

<cfif NOT IsDefined("client.volunteers.role") or resetFilters>
	<cfset client.volunteers.role = "All">
<cfelseif IsDefined("filterRole")>
	<cfset client.volunteers.role = filterRole>
</cfif>
<cfif client.volunteers.role neq "All">
	<cfset isFiltered = true />
	<cfset queryParams.Role = client.volunteers.role />
</cfif> --->

<!--- <cfif NOT IsDefined("client.volunteers.status") or resetFilters>
	<cfset client.volunteers.status = "All">
<cfelseif IsDefined("filterStatus")>
	<cfset client.volunteers.status = filterStatus>
</cfif>
<cfif client.volunteers.status neq "All">
	<cfset isFiltered = true />
	<cfset queryParams.Status = client.volunteers.status />
</cfif> --->

<cfset StructDelete(client, "volunteers.status")>

<cfif NOT IsDefined("client.volunteers.pool") or resetFilters>
	<cfset client.volunteers.pool = "No">
<cfelseif IsDefined("filterPool")>
	<cfset client.volunteers.pool = filterPool>
</cfif>
<cfif client.volunteers.pool eq "Yes">
	<cfset isFiltered = true />
	<cfset queryParams.pool = client.volunteers.pool />
	<cfset filterOrganizationIDs = "All" />
</cfif>

<cfif NOT IsDefined("client.volunteers.organizationIDs") or resetFilters>
	<cfset client.volunteers.organizationIDs = "All">
<cfelseif IsDefined("filterOrganizationIDs")>
	<cfset client.volunteers.organizationIDs = filterOrganizationIDs>
</cfif>
<cfif client.volunteers.organizationIDs neq "All">
	<cfset isFiltered = true />
	<cfset queryParams.organizationIDs = client.volunteers.organizationIDs />
</cfif>

<cfif IsUserInRole("Super User")>
	<cfif NOT IsDefined("client.volunteers.regionIDs") or resetFilters>
		<cfset client.volunteers.regionIDs = "All">
	<cfelseif IsDefined("filterRegionIDs")>
		<cfset client.volunteers.regionIDs = filterRegionIDs>
	</cfif>
<cfelseif IsUserInRole("Regional Admin")>
	<cfset client.volunteers.regionIDs = request.authUser.regionID>
</cfif>
<cfif client.volunteers.regionIDs neq "All">
	<cfset isFiltered = true />
	<cfset queryParams.regionIDs = client.volunteers.regionIDs />
</cfif>

<cfwddx action="cfml2wddx" input="#queryParams#" output="client.volunteers.queryParamsWDDX" />

<cfscript>
	base = new assets.calgrants.com.Base();
	volunteerGateway = new assets.calgrants.com.gateway.VolunteerGateway();
	volunteers = volunteerGateway.query(argumentCollection = queryParams);
	organizationGateway = new assets.calgrants.com.gateway.OrganizationGateway();
	organizations = organizationGateway.query(regionIDs = IIf(IsUserInRole("Regional Admin"), request.authUser.regionID, ""), Organization_ID = IIf(IsUserInRole("Organizer") OR IsUserInRole("Site Contact"), request.authUser.organizationID, ""));
	storedProcedureGateway = new assets.calgrants.com.gateway.StoredProcedureGateway();
	regions = storedProcedureGateway.call("getDistinctRegions");
</cfscript>

<script type="text/javascript">
	var selectImportFile = function() {
		$("#importFile").trigger("click");
	}
	var importFileSelected = function() {
		var filePath = $("#importFile").val();
		var filePathArray = filePath.split("\\");
		var selectedFile = filePathArray[filePathArray.length - 1];
		var selectedFileArray = selectedFile.split(".");
		var selectedFileExt = selectedFileArray[selectedFileArray.length - 1];
		$("#importFileWidget").html("\<strong\>Selected file:\<\/strong\> " + selectedFile);
	}
	var importFile = function() {
		$(importFileForm).submit();
	}
</script>

<!---
use this when kendo multi-select drop down list becomes available so templates can be used on the organizations and regions filters
<script type="text/javascript">
	<cfoutput>
		var pool = "#client.volunteers.pool#";
		var organizationIDs = "#client.volunteers.organizationIDs#";
		var regionIDs = "#client.volunteers.regionIDs#";
		
		var organizations =  new kendo.data.DataSource();
		organizations.data(#SerializeJSON(base.QueryToStruct(organizations), false)#);
		
		var regions =  new kendo.data.DataSource();
		regions.data(#SerializeJSON(base.QueryToStruct(regions), false)#);
	</cfoutput>
</script>
--->
<cfoutput>

	<h3>Volunteers<cfif isFiltered> <small><em>filtered</em></small></cfif></h3>

	<div class="row-fluid" style="margin-bottom: 10px;">
		<div class="span12">
			<a href="#script_name#?view=editVolunteer&Volunteer_ID=0" class="btn">New&nbsp;volunteer</a>
			<a id="filterLink" href="##" class="btn" onclick="toggleFilter('filter')">Show filters</a>
			<div class="btn-group">
				<button class="btn dropdown-toggle" data-toggle="dropdown">Actions</button>
				<button class="btn dropdown-toggle" data-toggle="dropdown"><span class="caret"></span></button>
				<ul class="dropdown-menu">
					<cfif volunteers.RecordCount gt 0>
						<li><a href="?action=export&collection=volunteers" target="_new">Export</a></li>
					</cfif>
					<li><a data-toggle="modal" href="##importVolunteersModal">Import</a></li>
				</ul>
			</div>
			<span class="pull-right"><strong>Count:</strong> #volunteers.RecordCount#</span>
		</div>
	</div>

	<cfform name="volunteersForm" id="volunteersForm" action="#script_name#" method="post">
		<cfinput type="hidden" name="view" value="#view#">
		
		<div id="filter" class="alert alert-info alert-block" style="display: none;">
			<h4>Filters</h4>
			<table cellpadding="6">
				<tr valign="top">
					<td>
						<label>Organizations</label>
						<cfif client.volunteers.pool eq "Yes">
							<div style="width: 150px;"><small>Not applicable with Pool</small></div>
						<cfelse>
							<cfselect name="filterOrganizationIDs" size="7" multiple="true" required="yes" message="Organization filter is required" style="width: 350px;">
								<option value="All"<cfif client.volunteers.organizationIDs eq "All"> selected</cfif>>All</option>
								<cfloop query="organizations">
								<option value="#Organization_ID#"<cfif ListFind(client.volunteers.organizationIDs, Organization_ID)> selected</cfif>>#Organization#</option>
								</cfloop>
							</cfselect>
						</cfif>
					</td>
					<cfif IsUserInRole("Super User")>
						<td>
							<label>Regions</label>
							<cfselect name="filterRegionIDs" size="7" multiple="true" required="yes" message="Region filter is required" style="width: 150px;">
								<option value="All"<cfif client.volunteers.regionIDs eq "All"> selected</cfif>>All</option>
								<cfloop query="regions">
								<option value="#Region_ID#"<cfif ListFind(client.volunteers.regionIDs, Region_ID)> selected</cfif>>#Region_ID#</option>
								</cfloop>
							</cfselect>
						</td>
					</cfif>
					<td>
						<label>Pool</label>
						<cfselect name="filterPool" size="1" multiple="false" required="yes" message="Pool is required" style="width: 150px;">
							<option value="Yes"<cfif client.volunteers.pool eq "Yes"> selected</cfif>>Yes</option>
							<option value="No"<cfif client.volunteers.pool eq "No"> selected</cfif>>No</option>
						</cfselect>
					</td>
				</tr>
				<tr>
					<td colspan="5">
						<button type="submit" class="btn btn-info">Apply</button> <a href="#script_name#?view=volunteers&resetFilters=true" class="btn btn-info">Clear</a>
					</td>
				</tr>
			</table>
		</div>

		<cfif volunteers.RecordCount gt 0>

			<table id="volunteersList" style="display: none; width: 100%">
				<thead>
					<th>ID</th>
					<th>Organization</th>
					<th>Region</th>
					<th>Name</th>
					<th>E-mail</th>
					<th>Phone</th>
					<th>Workshops</th>
					<th>Date Created</th>
				</thead>
				<tbody>
					<cfloop query="volunteers">
						<tr>
							<td><a href="#script_name#?view=editVolunteer&Volunteer_ID=#Volunteer_ID#">#Volunteer_ID#</a></td>
							<td>
								<cfif Organization_ID gt 0>
									#Organization_Organization#
								<cfelse>
									Volunteer Pool
								</cfif>
							</td>
							<td>#Region_ID#</td>
							<td>#First_Name# #Last_Name#</td>
							<td>#LCase(Email)#</td>
							<td>#base.formatPhone(Phone)#<cfif Len(Trim(Extension)) gt 0> x #Extension#</cfif></td>
							<td></td>
							<td><span class="sortHide">#DateFormat(Date_Created, "yyyymmdd")#</span>#DateFormat(Date_Created, "m/d/yyyy")#</td>
						</tr>
					</cfloop>
				</tbody>
			</table>
			
			<script type="text/javascript">
				$(function() {
					$("##volunteersList").kendoGrid({
						sortable: {
							mode: "single",
							allowUnsort: false
						}		
					})
					$("##volunteersList").show();
				})
			</script>
			
		<cfelse>
		
			<div class="alert alert-info notFound">No volunteers</div>
	
			<script type="text/javascript" language="javascript">
			<!--
				$(function() {
					$("##filter").show();
				});
			// -->
			</script>
			
		</cfif>

	</cfform>
	
	<div id="importVolunteersModal" class="modal hide" style="width: 750px;">
		<div class="modal-header">
			<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
			<h4 class="modal-title">Import Volunteers</h4>
		</div>
		<div class="modal-body">
			<p>Import volunteers using the <a href="/assets/calgrants/ui/templates/Volunteer_Import_Template.xlsx" target="_blank">Volunteer Import Template</a>.</p>
			<div class="well well-framed">
				<strong>Template Columns</strong>
				<table cellpadding="10">
					<tr valign="top">
						<td style="font-size: 0.8em;">
							Volunteer_ID - 0 for new volunteer<br />
							Status - Assigned, Confirmed, Attended, Acknowledged<br />
							First_Name<br />
							Last_Name<br />
							Address<br />
							City<br />
							Zip_Code<br />
							County<br />
							Phone - ######-######-########<br />
							Extension<br />
							Email<br />
							Travel_Distance - in miles<br />
							Shirt_Size - S, M, L, XL, XXL<br />
							Student - yes/no<br />
						</td>
						<td style="font-size: 0.8em;">
							Financial_Aid_Expert - yes/no<br />
							FAFSA_Expert - yes/no<br />
							Finance_Expert - yes/no<br />
							Tax_Expert - yes/no<br />
							Outreach_Expert - yes/no<br />
							AB540_CA_Dream_Act_Expert - yes/no<br />
							Technology_Expert - yes/no<br />
							Translator - yes/no<br />
							Translator_Languages - comma separated list of languages<br />
							Region_IDs - comma separated list of Region IDs<br />
							Organization_IDs - comma separated list of Organization IDs<br />
							Workshop_IDs - comma separated list of Workshop IDs<br />
						</td>
					</tr>
				</table>
			</div>
			<div id="importFileWidget"><button type="button" class="btn btn-info" onclick="selectImportFile()">Select File</button></div>
		</div>
		<div class="modal-footer">
			<button type="button" class="btn btn-info" data-dismiss="modal">Cancel</button>
			<button type="button" class="btn btn-info" onclick="importFile();">Import</button>
		</div>
	</div>
	
	<form id="importFileForm" action="#script_name#" method="post" style="display: none;" enctype="multipart/form-data">
		<input type="hidden" name="action" value="import" />
		<input type="hidden" name="collection" value="volunteers" />
		<input type="hidden" name="view" value="#view#" />
		<input type="hidden" name="fileField" value="importFile" />
		<input type="file" id="importFile" name="importFile" onchange="importFileSelected();" style="display: none;">
	</form>

</cfoutput>